<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<link rel="stylesheet" href="../css/test.css" type="text/css" media="screen" charset="utf-8">
	<link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" />
	<link rel="stylesheet" href="http://libs.cartodb.com/cartodb.js/v3/3.11/themes/css/cartodb.css" />
		<title>Test</title>
	<!--just for testing some functions:-->
	<!--    1. the full-scrolling map-->
	<!--    2. a half-transparent trabecula on top of the page.-->
	<!--    3. a text-box for google map search in the middle of the trabecula.-->
	<!--    4. after the search for the user's interest, the map will be reset. the center and zoom of the map will changed.-->
	<!--copyright by Joker777 <superyangyw@126.com>-->
	<!--2014-12-19 16:26-->
</head>
<body>
	<div class = "mapSearch" id = "topSearchTrabecular">
			<div class ="mapSearch" id = "topSearchBox">
					<div id="topSearchContainer" class = "mapSearch">
						
						<!--<img id = "topSearchImg" class = "mapSearch" src="../resources/position.png" />-->
						<button id = "topLocateBtn">
								<i id = "findMe"></i>
						</button>
						<input id = "topSearchTextBox" class = "mapSearch searchContainer20141224" type="text" />
						<!--<input type="button" class = "mapSearch" id ="topSearchButton" />-->
						<button class = "mapSearch" id = "topSearchButton" src ="../resources/search.gif"></button>
					</div>
			</div>
	</div>
	<div id = "map"></div>
	<div id="informationPanel" >
		<div id="firstLineInPanel" class = "boxBorderInPanel relativeControl" >
				<div id="panelControlContainer" class = "relativeControl">
					<button id = "panelControl">
					</button>
				</div>
		</div>
		<div id="informationTabList">
				<div id="informationTabSearch">
						<button id = "informationTabSearchBtn" class = "tabBtn">Search
						</button>
				</div>
				<div id="informationTabEcharts">
						<button id = "informationTabEchartsBtn" class = "tabBtn">Echarts
						</button>
				</div>
		</div>
		<div id="informationContent" class = "overFlowHidden" >

				<!--<p id = "testP"></p>-->
		</div>
		<!--<div id="secondLineInPanel" class = "boxBorderInPanel" >-->
		<!--</div>-->
		<!--<div id="contentInPanel" class = "boxBorderInPanel" >-->
		<!--</div>-->
	</div>
	<script type = "text/javascript" charset="utf-8" src="../js/jquery-1.11.2.min.js"> </script>
	<script src="http://libs.cartodb.com/cartodb.js/v3/3.11/cartodb.js"></script>
	<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
	<script type="text/javascript" charset="utf-8" src="../js/testForSearch.js">	</script>
</body>
</html>
